/* Custom Crestron CSS Theme for Hydrogen + Mercury  */

/* Device Page Tabs */
#cui-device-tabs .ui-tabview .ui-tabview-nav li a::before {
	font-family: FontAwesome;

	font-weight: bold;
    position: relative;
    left: 1px;
}

/* DataTable Header overrides */
.crux .ui-datatable table thead tr th {
    border: none;
    text-align: left;
    padding: 10px;
}

/* DataTable Row overrides */
.crux .ui-datatable .ui-datatable-even,
.crux .ui-datatable .ui-datatable-odd {
    background-color: #ffffff;
    border-left: solid 1px #d1d1d1;
    border-right: solid 1px #d1d1d1;
}

.crux .ui-datatable table tbody tr td {
    border-left: none;
    border-right: none;
}

/* Button Colors */

/* Clear Button w transparent background */
.crux .ClearButton.ui-button {
  background-color: rgba(0,0,0,0.00);
}

.crux .ClearButton .ui-button-text {
  background-color: rgba(0,0,0,0.00);
  color: #525252;
  border: 0px;
  height: 15px;/*MM*/
}

.crux .ClearButton.ui-state-hover .ui-button-text {
  background-color: rgba(111,112,132,1) !important;
}

.crux .ClearButton.ui-state-focus .ui-button-text {
  background-color: rgba(111,112,132,0.80) !important;
}
.crux .ClearButton.ui-state-active .ui-button-text {
  background-color: #CCCFD2 !important;
}

/* BIS: ClearButton on an accordion header */
.crux .ui-accordion-header .ClearButton.ui-state-hover .ui-button-text {
  background-color: rgba(111,112,132,0.20) !important;
}

.crux .ui-accordion-header .ClearButton.ui-state-focus .ui-button-text {
  background-color: rgba(111,112,132,0.20) !important;
}

.crux .ui-accordion-header .ClearButton .ui-button-icon-left {
  color: #525252 !important;
}

.crux .GreenButton .ui-button-text {
  background-color: #48C468;
  border-color: #42A55B;
}
.crux .GreenButton.ui-state-hover .ui-button-text {
  background-color: #54E679;
}
.crux .GreenButton.ui-state-active .ui-button-text {
  background-color: #42A55B;
}
.crux .RedButton .ui-button-text {
  background-color: #E25177;
  border-color: #BD4967;
}
.crux .RedButton.ui-state-hover .ui-button-text {
  background-color: #BD4967;
}
.crux .RedButton.ui-state-active .ui-button-text {
  background-color: #BD4967;
}
.crux .AquaButton .ui-button-text {
  background-color: #3F95B4;
  border-color: #3A7F98;
}
.crux .AquaButton.ui-state-hover .ui-button-text {
  background-color: #52BDE4;
}
.crux .AquaButton.ui-state-active .ui-button-text {
  background-color: #3A7F98;
}
.crux .NavyButton .ui-button-text {
  background-color: #334659;
  border-color: #313F4F;
}
.crux .NavyButton.ui-state-hover .ui-button-text {
  background-color: #5A7592;
}
.crux .NavyButton.ui-state-active .ui-button-text {
  background-color: #313F4F;
}
.crux .OrangeButton .ui-button-text {
  background-color: #FFC16A;
  border-color: #D4A25D;
}
.crux .OrangeButton.ui-state-hover .ui-button-text {
  background-color: #FDCA83;
}
.crux .OrangeButton.ui-state-active .ui-button-text {
  background-color: #D4A25D;
}
.crux .GrayButton .ui-button-text {
  background-color: #ECEFF1;
  color: #525252;
  border-color: #CCCFD2;
}
.crux .GrayButton.ui-button {
  color: #525252;
}
.crux .GrayButton.ui-state-hover .ui-button-text {
  background-color: #F5FBFF !important;
}
.crux .GrayButton.ui-state-active .ui-button-text {
  background-color: #CCCFD2 !important;
}
.crux .PinkButton .ui-button-text {
  background-color: #FF83AD;
  border-color: #DA688F;
}
.crux .PinkButton.ui-state-hover .ui-button-text {
  background-color: #FD98BB !important;
}
.crux .PinkButton.ui-state-active .ui-button-text {
  background-color: #DA688F !important;
}
.crux .PurpleButton .ui-button-text {
  background-color: #CF53ED;
  border-color: #CF53ED;
}
.crux .PurpleButton.ui-state-hover .ui-button-text {
  background-color: #E67EFF !important;
}
.crux .PurpleButton.ui-state-active .ui-button-text {
  background-color: #CF53ED !important;
}
.crux .YellowButton .ui-button-text {
  background-color: #FEBE4A;
  border-color: #CCA560;
}
.crux .YellowButton.ui-state-hover .ui-button-text {
  background-color: #FFEC73 !important;
}
.crux .YellowButton.ui-state-active .ui-button-text {
  background-color: #E8DB7C !important;
}
.crux .BrownButton .ui-button-text {
  background-color: #6D5850;
  border-color: #4A3A35;
}
.crux .BrownButton.ui-state-hover .ui-button-text {
  background-color: #90776F !important;
}
.crux .BrownButton.ui-state-active .ui-button-text {
  background-color: #4A3A35 !important;
}

/* New button color makes button look like a link
Author: Michael Ang 20161220 */
.crux .LinkButton {
    background-color: transparent;
}

/* New button color makes button look like a link
Author: Michael Ang 20161220 */
.crux .LinkButton .ui-button-text {
  background-color: transparent;
  border-color: transparent;
  color: #0099ff;
}

/* New button color makes button look like a link
Author: Michael Ang 20161220 */
.crux .LinkButton.ui-state-hover .ui-button-text,
.crux .LinkButton.ui-state-active .ui-button-text {
    text-decoration: underline;
}

/* Colors the dialog footer to a light grey
Author: Michael Ang 20161220 */
.ui-dialog .ui-dialog-buttonpane {
    background-color: #e4e4e4;
}

.crux .ui-button-text {
	background-color: #0099ff;
}

/* Override style for spinner input and buttons
Author: Rizza Mendoza 20161213 */
.crux .ui-spinner .ui-spinner-input {
  padding-right: 30px !important;
  text-align: right;
}
.crux .ui-spinner .ui-spinner-button {
  width: 25px;
}
.crux .ui-spinner .ui-spinner-button .ui-button-text {
  background-color: #fff;
  border: none;
  color: #525252;
}
.crux .ui-spinner .ui-spinner-button.ui-state-hover,
.crux .ui-spinner .ui-spinner-button.ui-state-hover .ui-button-text  {
  background-color: #EFEFEF !important;
}
.crux .ui-spinner .ui-spinner-button .fa {
  left: 4px !important;
}

/* Background, Font, Icon color */

.crux .Green {
	color: #4dbc6a !important;
}

.crux .Yellow {
    color: #e9c829 !important;
}

.crux .Red {
	color: #E25177 !important;
}

.crux .Navy {
	color: #4e5a66 !important;
}

.crux .Blue {
	color: #0099ff !important;
}

/* Override color and opacity for vertical tab menu background.
Author: Valerie Cayo 20161201 */
.crux #layout-tab-menu {
	background-color: rgba(28, 37, 39, 1);
  z-index: 1; /* This keeps the tab menu on highest z-index level*/
}

/* Override color for submenu background*/
.crux .layout-tab-submenu {
	background-color: #343A3E;
}

/* Override color for submenu background flyout trail */
.crux #layout-menu-cover {
	background-color: #343A3E;
}

.crux #layout-tab-menu > li > a:hover, #layout-tab-menu > li > a:focus, #layout-tab-menu > li > a.active {
	background-color: #343A3E;
}

/* header bar background color override */
.crux #layout-topbar-cover {
	background-color: #06131a;
}

.crux .topbar-link:hover, .topbar-link:focus {
	background-color: rgba(52, 58, 62, 0.8);
	cursor: pointer;
}

/* override color for dashboard widget background */
.crux .LeadenBack {
	background-color: #21262c;
}

/* tab view header tab background color */
.crux .ui-tabview-top .ui-tabview-nav {
	background-color: rgba(33, 38, 44, 0.9);
}


/* tab button active font color */
.crux .ui-tabview-top .ui-tabview-nav li.ui-tabview-selected a, .ui-tabview-top .ui-tabview-nav li.ui-tabview-active a, .ui-tabview-top .ui-tabview-nav li.ui-state-hover a {
	color: #282828 !important;
}

/* tab button inactive font color */
.crux .ui-tabview-top .ui-tabview-nav li a{
	color: #c3c5c6 !important;
}

.crux label.ui-outputlabel {
    font-weight: 700 !important;
}

/* disabled menu item */
.ui-menu .disabled.ui-menuitem .ui-menuitem-link {
	pointer-events: none;
	cursor: default;
	color: #A1A1A1;
}
/*  tree autocomplete dropdown button */
.crux  #env_tree .ui-autocomplete .ui-button-icon-only .fa {
  color: #525252;
}

/*duplicate logo class deleted - BIS 1/3/17 */

.crux .GroupTreeNodeEdit .fa {
  font-size: xx-small;
  margin-left: 0px;
}

.crux .GroupTreeNodeEdit .ui-button-text {
  padding: 2px 0px !important;
  font-size: xx-small;
}

.crux .GroupTreeNodeEdit .ui-button-icon-only {
  min-width: 12px !important;
  max-width: 12px !important;
}

.crux .GroupTreeNodeEdit .ui-button-icon-only .fa {
  left: 0px;
}




.crux #hyd-groups-tree-navigation .ui-tree .ui-treenode .ui-treenode-label:hover {
	background-color: rgb(72, 77, 81);
}




.crux #hyd-groups-tree-navigation > devices-unassociated > p-panelmenu > div > div > div.ui-widget.ui-panelmenu-header.ui-state-default.ui-corner-all {
  color: #ffffff;
  font-family: 'latoregular';
  background-color: rgba(255, 255, 255, 0.1);
}



/* BREADCRUMB NAVIGATION */
.crux .ui-breadcrumb {
	background:none;
	border:none;
	padding-left: 0px !important;
}

/* PAGE TITLE INPLACE EDIT */
/* Author: Ben Shectman 12/1/16 */
.crux .BigTopic .ui-inplace .ui-inplace-display span{
	border-bottom: 1px dashed #0099ff;
}
.crux .BigTopic .ui-inplace .ui-inplace-display::after{
	color: #0099ff;
}
.crux .BigTopic .ui-inplace .ClearButton.ui-state-hover .ui-button-text {
  background-color: rgba(111,112,132,0.20) !important;
}
.crux .BigTopic .ui-inplace .ClearButton.ui-state-focus .ui-button-text {
  background-color: rgba(111,112,132,0.20) !important;
}

/* FORM STYLES */
.crux label.ui-outputlabel {
    font-weight: 700 !important;
}

.crux .ui-fieldset-legend {
	background-color:transparent;
	color: #525252;
	opacity: .75;
}

/* Accordion Fieldset Style
Author: Algef Almocera 20161208 */
.crux .ui-accordion-content .ui-fieldset {
    margin-left: -20px;
    margin-right: -20px;
}

.crux .ui-inputswitch-handle {
  background-color: #ECEFF1;
  color: #525252;
  border-color: #CCCFD2;
}

.crux .ui-inputswitch-checked .ui-inputswitch-handle {
  background-color: #0099ff;
  color: inherit;
  border-color: #0893c7;
}

/* Red underline for invalid fields
Author: Rizza Mendoza 20161206 */
.crux .invalid {
    border-bottom-color: #f44336;
}

/* override for header bar logo */
/*Author: BIS 20170103 */
.crux #logo {
	width: 94%;
    cursor: pointer;
	/*background-image: url("../img/logo-white-header.svg");*/
	background-repeat: no-repeat;
	background-position: left center;
}

/* splash page logo class
Author: BIS 20170103 */
.crux #logo-splash {
	height: 25px;
	/*background-image: url("../img/logo-white-splash.svg");*/
	background-repeat: no-repeat;
	background-size: 300px 25px; 
	background-position: center center;
	
}

/* Layout-Sub-Menu */

/* Add ellipsis to long texts in the layout-submenu
Author: Valerie Cayo 20161110 */
.crux .truncate-with-ellipsis {
    display: block;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

/* Data Table */

/* Override: DataTable header text alignment
Author: Michael Ang 20161027 */
.crux .ui-datatable table thead tr th {
    border: none;
    text-align: left;
    padding: 10px;
}

/* Override: Sets the drataTable left and right row
Author: Michael Ang 20161027 */
.crux .ui-datatable .ui-datatable-even,
.crux .ui-datatable .ui-datatable-odd {
    background-color: #ffffff;
    border-left: solid 1px #d1d1d1;
    border-right: solid 1px #d1d1d1;
}

/* Override: Removes the dataTable left and right cell border
Author: Michael Ang 20161027 */
.crux .ui-datatable table tbody tr td {
    border-left: none;
    border-right: none;
}


/* Timepicker  */
/*MM*/
.crux  .ui-timepicker{
    background-color: #343a3e;
}


/* Growls for Notifications  */
 /* MM  */
 .crux .ui-messages{
     opacity:0.90;
 }

 /* MM  */
  .crux .ui-growl{
     opacity:0.90;
      border-radius:10px;
 }

 /* MM  */
.crux  .ui-growl-message-success .ui-growl-item {
   background-color:#29bf29;
   color:white;
   border:none;
}

 /* MM  */
.crux  .ui-growl-message-error .ui-growl-item {
   background-color:#e43939;
   color:white;
   border:none;
}

 /* MM  */
.crux  .ui-growl-message-warn .ui-growl-item {
   background-color:#e57728;
   color:white;
   border:none;
}

 /* MM  */
.crux  .ui-growl-message-info .ui-growl-item {
   background-color:#3e3ec6;
   color:white;
   border:none;
}


/* MM  */
/* 20171022 NVXDirector
.crux  .ui-steps .ui-steps-item .ui-steps-number{
    background-color: #51b515!important;
     color: #FFFFFF;
    font-size: 12px;
}
*/
/* MM  */
/*.crux  .ui-steps .ui-steps-item .ui-steps-number{

}*/

 /* MM  */
/*
 .crux .ui-steps.steps-custom .ui-steps-item .ui-steps-title {
    color: #555555;
    font-size:9px;
}
*/
 /*MM*/
 .crux .ui-tooltip{
      background-color:white;
      border: white;

 }
